<template>
    <div class="config-dialog">
	<el-dialog title="薪资设置" v-model="visible" :close-on-click-modal="false" :width="800" custom-class="notpt" destroy-on-close @closed="$emit('closed')">
		<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="130px" label-position="right">
            <el-divider content-position="left">机构薪资</el-divider>
			<el-row>
                <el-col :span="12">
                    <el-form-item label="底薪" prop="base_salary">
                        <el-input v-model="form.base_salary" placeholder="请输入底薪" clearable>
                        </el-input>
                    </el-form-item>
                    <el-form-item label="30分钟课" prop="class_hour_30">
                        <el-input v-model="form.class_hour_30" placeholder="请输入30分钟课" clearable>
                        </el-input>
                    </el-form-item>
					<el-form-item label="抗遗忘" prop="forget_salary">
                        <el-input v-model="form.forget_salary" placeholder="请输入抗遗忘薪资" clearable>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="体验课" prop="trial_course">
                        <el-input v-model="form.trial_course" placeholder="请输入体验课薪资" clearable></el-input>
                    </el-form-item>
                    <el-form-item label="60分钟课" prop="class_hour_60">
                        <el-input v-model="form.class_hour_60" placeholder="请输入60分钟课" clearable>
                        </el-input>
                    </el-form-item>
                </el-col>
		    </el-row>
            <el-divider content-position="left">教练薪资</el-divider>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="初级教练" prop="teacher_base_level">
                        <el-input v-model="form.teacher_base_level" placeholder="请输入初级教练" clearable>
                        </el-input>
                    </el-form-item>
                    <el-form-item label="高级教练" prop="teacher_senior_level">
                        <el-input v-model="form.teacher_senior_level" placeholder="请输入高级教练" clearable>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="中级教练" prop="teacher_middle_level">
                        <el-input v-model="form.teacher_middle_level" placeholder="请输入中级教练" clearable></el-input>
                    </el-form-item>
                </el-col>
		    </el-row>
		</el-form>
		<template #footer>
			<el-button @click="visible=false" >取 消</el-button>
            <el-button v-if="mode!='show'" type="warning" @click="originalValue()">默认配置</el-button>
            <el-button v-if="mode!='show'" type="danger"  @click="resetFun">全部置零</el-button>
			<el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
		</template>
	</el-dialog>
    </div>
</template>

<script>

import { in_array } from '@/utils/index.js'
	export default {
		emits: ['success', 'closed'],
		data() {
			return {
				in_array,
				mode: "add",
				visible: false,
				isSaveing: false,
				form: this.getDefaultRuleForm(),
				//验证规则
				rules: {
					base_salary: [
						{required: true, message: '请输入底薪'},
						{
							pattern: /^0$|^0\.([0-9]{1,2})$|^[0-9]\d{0,8}\.\d{1,2}$|^[0-9]\d{0,8}$/,
							message: "只能输入大于或等于0且最多2位小数的数",
							trigger: "blur",
						}
					],
					trial_course: [
						{required: true, message: '请输入体验课薪资'},
						{
							pattern: /^0$|^0\.([0-9]{1,2})$|^[0-9]\d{0,8}\.\d{1,2}$|^[0-9]\d{0,8}$/,
							message: "只能输入大于或等于0且最多2位小数的数",
							trigger: "blur",
						}
					],
                    class_hour_30: [
						{required: true, message: '请输入30分钟课薪资'},
						{
							pattern: /^0$|^0\.([0-9]{1,2})$|^[0-9]\d{0,8}\.\d{1,2}$|^[0-9]\d{0,8}$/,
							message: "只能输入大于或等于0且最多2位小数的数",
							trigger: "blur",
						}
					],
                    class_hour_60: [
						{required: true, message: '请输入60分钟课薪资'},
						{
							pattern: /^0$|^0\.([0-9]{1,2})$|^[0-9]\d{0,8}\.\d{1,2}$|^[0-9]\d{0,8}$/,
							message: "只能输入大于或等于0且最多2位小数的数",
							trigger: "blur",
						}
					],
                    teacher_base_level: [
                        {required: true, message: '请输入初级教练薪资'},
                        {
							pattern: /^0$|^0\.([0-9]{1,2})$|^[0-9]\d{0,8}\.\d{1,2}$|^[0-9]\d{0,8}$/,
							message: "只能输入大于或等于0且最多2位小数的数",
							trigger: "blur",
						}
                    ],
                    teacher_middle_level: [
                        {required: true, message: '请输入中级教练薪资'},
                        {
							pattern: /^0$|^0\.([0-9]{1,2})$|^[0-9]\d{0,8}\.\d{1,2}$|^[0-9]\d{0,8}$/,
							message: "只能输入大于或等于0且最多2位小数的数",
							trigger: "blur",
						}
                    ],
                    teacher_senior_level: [
                        {required: true, message: '请输入高级教练薪资'},
                        {
							pattern: /^0$|^0\.([0-9]{1,2})$|^[0-9]\d{0,8}\.\d{1,2}$|^[0-9]\d{0,8}$/,
							message: "只能输入大于或等于0且最多2位小数的数",
							trigger: "blur",
						}
                    ],
					forget_salary: [
                        {required: true, message: '请输入抗遗忘薪资'},
                        {
							pattern: /^0$|^0\.([0-9]{1,2})$|^[0-9]\d{0,8}\.\d{1,2}$|^[0-9]\d{0,8}$/,
							message: "只能输入大于或等于0且最多2位小数的数",
							trigger: "blur",
						}
                    ],
				},
			}
		},
		mounted() {
		},
		methods: {
			//显示
			open(){
				this.visible = true;
				return this
			},
			//表单提交方法
			submit() {
				this.$refs.dialogForm.validate(async (valid, fields) => {
					if (!valid) {
						for (let key in fields) {
							if (typeof (fields[key]) !== 'object' || !fields[key][0]) {
								continue;
							}
						}
						return false
					}


					let arr = []
					for (let i in this.form) {
						arr.push({ key: i, value: this.form[i] })
					}

					try {
						this.isSaveing = true;
						await this.$API.system.config.put({ config: arr }).then(res => {
							this.isSaveing = false;
							if(res.error === 0){
								this.visible = false;
								this.$notify.success("保存成功");
							}
						})
					} catch (error) {
						this.isSaveing = false;
					}
				})
			},
			//表单注入数据
			setData(data) {
				for (let key in data) {
					if (typeof (this.form[key]) != 'undefined') {
						this.form[key] = data[key]
					}
				}
			},
			getDefaultRuleForm() {
				return {
					base_salary: "0",
					trial_course: "0",
					class_hour_30: "0",
					class_hour_60: "0",
					teacher_base_level: "0",
					teacher_middle_level: "0",
					teacher_senior_level: "0",
					forget_salary: "0"
				}
			},
            //重置为0
            resetFun() {
                this.form = this.getDefaultRuleForm()
            },
            //默认配置
            originalValue() {
                return this.form = {
					base_salary: "100",
					trial_course: "40",
					class_hour_30: "20",
					class_hour_60: "40",
					teacher_base_level: "40",
					teacher_middle_level: "45",
					teacher_senior_level: "50",
					forget_salary: "0"
				}
            },
		}
	}
</script>

<style lang="scss" scoped>
.el-form{
	height: 220px;
}
.title {
    padding-bottom: 20px;
    padding-left: 0px;
}

.tab-pane {
    margin-top: 10px;
}

.config-dialog:deep(.el-dialog):not(.is-fullscreen) {
    min-height: 500px;
}
</style>

